<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId      : '171726412964671', // App ID
            //channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
            status     : true, // check login status
            cookie     : true, // enable cookies to allow the server to access the session
            xfbml      : true  // parse XFBML
        });

        FB.Event.subscribe('auth.statusChange', function(response) {

            if (response.authResponse) {
                var accessToken = response.authResponse.accessToken;
                //Y.Cookie.set("accesstoken", accessToken);
                //window.location = "/test.php";
            } else {
                alert("Auth Fail");
            }
        });
        // Additional initialization code here
    };

    // Load the SDK Asynchronously
    (function(d){
        var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement('script'); js.id = id; js.async = true;
        js.src = "//connect.facebook.net/en_US/all.js";
        ref.parentNode.insertBefore(js, ref);
    }(document));
            
    FB.login(function(response) {
        if (response.authResponse) {
            console.log('Welcome!  Fetching your information.... ');
            FB.api('/me', function(response) {
                console.log('Good to see you, ' + response.name + '.');
            });
        } else {
            console.log('User cancelled login or did not fully authorize.');
        }
    });
</script>
<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">

            <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>

            <!-- Be sure to leave the brand out there if you want it shown -->
            <a class="brand" href="#">Compare Anything</a>

            <!-- Everything you want hidden at 940px or less, place within here -->
            <div class="nav-collapse">
                <!-- .nav, .navbar-search, .navbar-form, etc -->
                <ul class="nav">
                    <li class="active">
                        <a href="#">Home</a>
                    </li>
                    <li><a href="#">Link</a></li>
                    <li><a href="#">Link</a></li>
                </ul>
                <form class="navbar-form pull-right">
                    <?php if ($user) { ?>
                        <span>Welcome

                            <?php
                            print $user_profile['first_name'];
                            ?></span>

                    <?php } else { ?>
                        <input type="button" onclick="FB.login()" class="btn btn-primary" value="Login with facebook"/>
                    <?php } ?>

                </form>
            </div>



        </div>
    </div>
</div>